<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
        <button>点击</button>

        <script>
            // 元素.addEventListener('事件类型', 函数) 多个会追加
            // 元素.onclick = function () {} 旧版本写法，写多个会覆盖 不能事件捕获
            // 事件源（就是被触发的元素） 事件类型 函数
            const btn  = document.querySelector('button')
            btn.addEventListener('click', (e)=> alert('被点击了'))

            // 事件类型 ：鼠标事件 焦点事件 键盘事件 文本事件


            // 事件对象：事件绑定的回调函数的第一个参数 e
            // 常用属性： type 事件类型 clientX/clientY 光标位置 offsetX/offsetY 光标相对DOM元素左上角位置 key 键盘的键值 keyCode（已废弃）




        </script>

    </body>
</html>